{extend name="../../base/view/common/base" /}

{block name="body"}
<div class="p-page">
    <div class="layui-card">
        <div class="layui-card-body">
            <form class="layui-form toolbar" lay-filter="searchForm">
                <div class="layui-form-item">
                    <div class="layui-inline">
                        <input type="text" name="keywords" class="layui-input" placeholder="节点类型名称" autocomplete="off"/></div>
                    <div class="layui-inline">
                        <button class="layui-btn layui-btn-normal" lay-submit lay-filter="searchForm">
                            <i class="layui-icon layui-icon-search"></i>搜索
                        </button>
                        <button type="button" class="layui-btn layui-btn-primary" lay-submit lay-filter="searchFormReset">清空</button>
                    </div>
                </div>
            </form>
            <table id="dataTable" lay-filter="dataTable"></table>
        </div>
    </div>
</div>
{/block}

{block name="js"}
<script type="text/html" id="toolbar">
    <div class="layui-btn-container">
        <button class="layui-btn layui-btn-sm" lay-event="add">
            <i class="layui-icon">&#xe654;</i>添加
        </button>
    </div>
</script>

<script type="text/html" id="column-toolbar">
    <a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
    <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
</script>

<script>
const moduleInit = ['tool'];
function gouguInit() {
    let tool = layui.tool,
        table = layui.table,
        form = layui.form;

    //渲染表格
    table.render({
        elem: '#dataTable',
        url: '/lawcase/nodetype/index',
        toolbar: '#toolbar',
        defaultToolbar: ['filter', 'exports', 'print'],
        cols: [[
            {field: 'id', title: 'ID', width: 80, sort: true},
            {field: 'name', title: '节点类型名称', minWidth: 150},
            {field: 'case_type_name', title: '案件类型', width: 120},
            {field: 'sort', title: '排序', width: 100, sort: true, edit: 'text'},
            {field: 'create_time', title: '创建时间', width: 180, templet: function(d){
                return d.create_time ? layui.util.toDateString(d.create_time * 1000) : '';
            }},
            {field: 'update_time', title: '修改时间', width: 180, templet: function(d){
                return d.update_time ? layui.util.toDateString(d.update_time * 1000) : '';
            }},
            {title: '操作', toolbar: '#column-toolbar', width: 200, fixed: 'right'}
        ]],
        page: true
    });

    // 表格工具栏事件
    table.on('toolbar(dataTable)', function(obj){
        if (obj.event === 'add') {
            tool.side('/lawcase/nodetype/add', '添加节点类型');
        }});

    // 表格行工具栏事件
    table.on('tool(dataTable)', function(obj){
        let data = obj.data;
        if (obj.event === 'edit') {
            tool.side('/lawcase/nodetype/edit?id=' + data.id, '编辑节点类型');
        } else if (obj.event === 'del') {
            layer.confirm('确定要删除该节点类型吗？', {
                title: '提示'
            }, function(index){
                tool.delete('/lawcase/nodetype/delete', {
                    ids: [data.id]
                }, function(res){
                    tool.reload('dataTable');
                });layer.close(index);
            });
        }
    });

    // 监听单元格编辑
    table.on('edit(dataTable)', function(obj){
        let value = obj.value,
            data = obj.data;
        
        tool.post('/lawcase/nodetype/sort', {
            id: data.id,
            sort: value
        }, function(res){
            tool.reload('dataTable');
        });
    });

    // 搜索
    form.on('submit(searchForm)', function(data){
        table.reload('dataTable', {
            where: data.field,
            page: {curr: 1}
        });
        return false;
    });

    // 重置
    form.on('submit(searchFormReset)', function(data) {
        // 重置表单
        form.val('searchForm', {
            keywords: ''
        });
        // 重新加载表格
        table.reload('dataTable', {
            where: {},
            page: {curr: 1}
        });
        return false;
    });
}</script>
{/block}